<!DOCTYPE html>
<html>
<head>
	<title></title>

	<style type="text/css">
		.blue{
			width: 500px;
			height: 200px;
			background: blue;

			/*蓝色  设置内边距*/
			/*padding-top:100px;*/

			/*margin-top:100px;*/

			/*margin: 50px; 一次性四个方向*/
			margin:20px 50px;/*上下  左右*/
			margin:10px 20px 50px; /*上  左右 下*/
			margin:10px 20px 30px 40px; /*上 右 下 左*/
			/*padding 的规律也是一样的*/

			background-image: url('images/news.png');
			background-repeat: no-repeat;
			background-size: 500px 200px;
		}

		.red{

			/*红色  设置外边距 (标签之间的距离)*/
			margin-left: 100px;
			width: 50px;
			height: 50px;
			background: red;

			/*红色里面的内容 改变*/
			padding-left: 15px;
			padding-top:15px;

		}
		.green{

			
			width: 20px;
			height: 20px;
			background: green;


		}
	</style>
</head>
<body>

<div class="blue">
	<!-- <div class="red">
		<div class="green">
			ds
		</div>
	</div> -->
</div>

</body>
</html>